import React from 'react';
import { inject, observer } from 'mobx-react';
import MonitorLogCondition from './MonitorLogCondition';
import {routerShape} from 'react-router';
import {
    WeaTop,
    WeaTab,
    WeaSearchGroup,
    WeaRightMenu,
} from 'ecCom'
import {WeaErrorPage,WeaTools,WeaLocaleProvider} from 'ecCom';
import {Button,Modal,message,Input,Row,Col} from 'antd'

const getLabel = WeaLocaleProvider.getLabel;
@inject('wfMonitorLogStore')

@observer
class MonitorLog extends React.Component {
    static contextTypes = {
        router: routerShape
    }
    constructor(props){
        super(props);
        this.state={}
        this.doInit(this.props);
    }
    doInit(props){
        let baseQueryParams = {};
        props.wfMonitorLogStore.initDatas();
        props.wfMonitorLogStore.doSearch(baseQueryParams);
    }
    componentDidMount() {
        _ListenerCtrl.bind();
    }
    componentWillUnmount() {
        this.props.wfMonitorLogStore.resetCondition();
        this.props.wfMonitorLogStore.resetTable();
        _ListenerCtrl.unbind();
    }
    varTemp = {
      collectParams: {favname:getLabel(31709,'日志查看'), favouritetype:2},
      rightBtns: [],
      btns: [],
      title: getLabel(31709,'日志查看')
    }
    render(){
        const { wfMonitorLogStore } = this.props;
        const { tableStore , monitorLogShow , loading} = wfMonitorLogStore;
        const loadingTable = tableStore.loading;
        this.varTemp.rightBtns = this.varTemp.btns = [];
        this.varTemp.rigthBtns = this.getRightMenu();
        this.varTemp.btns= this.getButtons();
        return(<div style={{
                    position:"relative",
                    zIndex:10,
                    height:"100%",
                    background:"white"}}
                    >
                    <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@d0dfde`} 
                        collectParams={this.varTemp.collectParams}
                        datas={this.varTemp.rightBtns} >
                        <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@l820rl`}
                            title={this.varTemp.title}
                            loading={ loading || loadingTable}
                            icon={<i className='icon-coms-workflow' />}
                            iconBgcolor='#0079DE'
                            buttons={this.varTemp.btns}
                            buttonSpace={10}
                            showDropIcon={true}
                            dropMenuDatas={this.varTemp.rightBtns}
                        >
                        </WeaTop>
                        {<MonitorLogCondition ecId={`${this && this.props && this.props.ecId || ''}_MonitorLogCondition@7elxig`} queryStore={wfMonitorLogStore} />}
                </WeaRightMenu>
            </div>)
    }
    getRightMenu(){
        const { wfMonitorLogStore } = this.props;
        const { tableStore} = wfMonitorLogStore;
    	let btns = [];
    	btns.push({
            key: "search",
    		icon: <i className='icon-workflow-Right-menu--search'/>,
            content:getLabel(197,'搜索'),
            onClick: key =>{
                wfMonitorLogStore.doSearch();
            }
        });
        //辅助切换
    	btns.push({
            key: "back",
    		icon: <i className='icon-coms-go-back'/>,
            content:getLabel(383624,'返回'),
            onClick: key =>{
                // wfMonitorLogStore.showMonitorLog(false);
                this.forwardMonitorResult();
            }
        });
        btns.push({
            key: "excel",
    		icon: <i className='icon-coms-content-o'/>,
            content:'EXCEL',
            onClick: key =>{
                tableStore.exportAll();
            }
        });
        btns.push({
            key:"colSet",
    		icon: <i className='icon-coms-Custom'/>,
            content:getLabel(382660,'显示列定制'),
            onClick: key =>{
                tableStore.setColSetVisible(true);
                tableStore.tableColSet(true);
            }
    	});
    	
    	return btns;
    }
    getButtons() {
        const { wfMonitorLogStore } = this.props;
        let btns = [];
        btns.push(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ex2om1@search`} 
                type="primary" 
                onClick={()=>{
                    wfMonitorLogStore.doSearch();
                }}>
                {getLabel(197,'搜索')}
        </Button>);
        //
        return btns
    }
    forwardMonitorResult(){
        this.context.router.push({
            pathname: "/main/workflow/monitorResult",
            query: {fromwhere:"monitor"},
            state:this.props.location.state
        });
    }
}

export default WeaTools.tryCatch(React,
    props => <WeaErrorPage ecId={`${this && this.props && this.props.ecId || ''}_WeaErrorPage@8ta85f`} msg={ props.error ? props.error : getLabel(383324,' 对不起，该页面异常，请联系管理员 ')+'！'}/>,
    {error: ""}
    )(MonitorLog);